<template>
    <div>
        <div v-if="driverFlag=='1'" class="form">
            <el-form ref="form" :model="good" inline label-width="120px" size="small" label-suffix="：" :rules="rules">
                <div class="box-title">司机信息</div>
                <el-form-item label="司机姓名" prop="driver">
                    <el-input v-model="good.driver" placeholder="请输入" clearable style="width: 150px"></el-input>
                </el-form-item>
                <el-form-item label="司机联系方式" prop="driverTel">
                    <el-input v-model="good.driverTel" placeholder="请输入" clearable style="width: 150px"></el-input>
                </el-form-item>
                <el-form-item label="身份证号" prop="certNumber">
                    <el-input v-model="good.certNumber" placeholder="请输入" clearable style="width: 150px"></el-input>
                </el-form-item>
            </el-form>
            <div class="btn">
                <el-button
                    type="primary"
                    size="small"
                    style="background-color: #043aa7"
                    :loading="butLoading"
                    @click="addGood"
                    >新增</el-button
                >
                <el-button type="primary" size="small" style="background-color: #043aa7" @click="cancel"
                    >取消</el-button
                >
            </div>
        </div>
        <div class="table">
            <div class="box-title">司机列表</div>
            <el-table :data="boxInfo.bcarDriverList" :header-cell-style="{ background: '#EEF1F5' }" style="width: 100%">
                <el-table-column prop="driver" label="司机姓名"> </el-table-column>
                <el-table-column prop="driverTel" label="司机联系方式"> </el-table-column>
                <el-table-column prop="certNumber" label="身份证号"> </el-table-column>
                <el-table-column prop="createName" label="创建人" width="170"> </el-table-column>
                <el-table-column prop="createTime" label="创建时间" >
					 <template slot-scope="scope">
						<span>{{scope.row.createTime.split('T')[0]}}</span>
					 </template>
				</el-table-column>
                <el-table-column v-if="driverFlag =='1'" fixed="right" label="操作">
                    <template slot-scope="scope">
                        <el-button @click="del(scope.$index)" type="text" style="color: #ff3838">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
    export default {
        name: "addGoods",
        props: {
            boxInfo: {},
            row: {},
			driverFlag:{},
        },
        components: {},
        data() {
            return {
                good: {},
                goods: [],
                rules: {
                    driver: [{ required: true, message: "请输入司机名称", trigger: "blur" }],

                    driverTel: [{ required: true, message: "请输入联系方式", trigger: "blur" }],
                    // certNumber: [{ required: true, message: "请输入身份证号", trigger: "blur" }]
                },
                consigneeList: [],
                deliverymdList: [],
                type: "",
                butLoading: false
            };
        },

        methods: {
            addGood() {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        this.loadAndUploadCheck();
                    }
                });
            },
            customerByType() {
                //货主
                this.$api
                    .customerByType({ tenantTypeName: "货主" })
                    .then((res) => {
                        this.consigneeList = res.data.data;
                    })
                    .catch((err) => {});
            },
            refCode() {
                //条款
                this.$api
                    .refCode({ domain: "DELIVERYMD" })
                    .then((res) => {
                        this.deliverymdList = res.data.data;
                    })
                    .catch((err) => {});
            },
            cancel() {
                // this.boxInfo.bcarDriverList = this.goods;
                // this.$emit("addItem", this.boxInfo);
                // this.$message.success("更新清单成功");
                //this.$emit('closeDialog')
				this.good = {}
            },
            del(index) {
				const that =this
				
				let params = {
					createName:JSON.parse(localStorage.getItem('userInfo')).name,
					createBy:JSON.parse(localStorage.getItem('userInfo')).userName,
				}
				this.boxInfo.bcarDriverList.map(item =>{
					params.id = item.id
				})
                this.$confirm("此操作将永久删除该数据, 是否继续?", "提示")
                    .then(() => {
						// deleteDriver
                        // this.goods.splice(index, 1);
						this.$api.deleteDriver(params).then(res=>{
							that.$message.success('删除成功')
							this.boxInfo.bcarDriverList.splice(index, 1);
							this.$emit('successDel')
						})
                    })
                    .catch(() => {});
            },
            //校验
            loadAndUploadCheck() {
                console.log(this.row);
                let params = {
                    carId: this.row.id, //
                    carNo: this.row.carNo, //
                    driver: this.good.driver,
                    driverTel: this.good.driverTel,
                    certNumber: this.good.certNumber,
                    createName: JSON.parse(localStorage.getItem("userInfo")).name,
                    createBy: JSON.parse(localStorage.getItem("userInfo")).userName
                };

                this.butLoading = true;
                this.$api
                    .insertDriver(params)
                    .then((res) => {
                        if (res.success) {
                            this.$message.success("新增成功");
                            // this.goods.push({ ...res.data });
                            this.boxInfo.bcarDriverList.push({ ...res.data })
                            console.log(this.boxInfo);
                            this.good = {};
                            this.$refs.form.resetFields();
                            this.$emit('successAdd')
                        } else {
                            this.$message.error(res.message);
                        }
                        this.butLoading = false;
                    })
                    .catch((err) => {});
            }
        },

        computed: {},
        mounted() {
            console.log(this.boxInfo);
            this.goods = this.boxInfo.bcarDriverList;
            this.type = this.$route.name == "unloadList" ? "I" : "E";
            this.customerByType();
            this.refCode();
        }
    };
</script>
<style lang="less" scoped>
    .box-title {
        font-size: 18px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #333333;
        line-height: 16px;
        text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
        line-height: 20px;
        padding-left: 10px;
        border-left: 5px solid #4980d5;
        margin-bottom: 10px;
    }
    .btn {
        text-align: center;
        .el-button {
            width: 80px;
        }
    }
</style>
